<template>
    <div>
        <el-container style="height: 500px; border: 1px solid #eee">
            <Home></Home>
            <el-container>
                <el-header style="text-align: right; font-size: 12px">
                    <el-dropdown>
                        <i class="el-icon-setting" style="margin-right: 15px"></i>
                        <el-dropdown-menu slot="dropdown">
                            <el-dropdown-item><el-link href="">设置</el-link></el-dropdown-item>
                            <el-dropdown-item><el-link type="success" href="/fee">刷新</el-link></el-dropdown-item>
                            <el-dropdown-item><el-link type="danger" href="/login">退出</el-link></el-dropdown-item>
                        </el-dropdown-menu>
                    </el-dropdown>
                    <span>桑尼酒店</span>
                </el-header>

<!--                //写自己想要的el-main-->
                <el-main>

                    <el-table
                            :data="tableData"
                            border
                            style="width: 100%">

                        <el-table-column
                                prop="feeType"
                                label="支付方式"
                                width="120">
                            <!--                            <span>{{feePage.id}}</span>-->
                        </el-table-column>
                        <el-table-column
                                fixed="right"
                                label="操作"
                                width="120">
                            <template slot-scope="scope">
                                <el-button @click="handleClick(scope.row)" type="text"><i class="el-icon-edit-outline"></i>
                                </el-button>
                                <el-button @click="checkOut(scope.row)" type="text"><i class="el-icon-s-unfold"></i></el-button>
                                <el-button @click="handleClick(scope.row)" type="text"><i class="el-icon-printer"></i>
                                </el-button>
                            </template>
                        </el-table-column>
                    </el-table>
                </el-main>
            </el-container>

        </el-container>
        <el-pagination class="fpage"
                       background
                       layout="prev, pager, next"
                       :total="1000">
        </el-pagination>
    </div>
</template>

<script>
    import Home from "../../components/Home"
    export default {
        name: "Check.vue",
        components:{Home},
    }
</script>

<style scoped>
    .fpage {
        margin: 0 auto;
        text-align: center;
    }
</style>